<?php $this->beginBlock('title');?>
    添加案例
<?php $this->endBlock();?>
<?php $this->params['breadcrumbs'] =
    [
        [
            'label' => '添加案例',
//            'url' => \yii\helpers\Url::to(['admin/case/add']),
            'class' => 'active',
        ]
    ];
?>

<?php $this->beginBlock('headerCssFile')?>
<link rel="stylesheet" type="text/css" href="/plugins/layui/css/layui.css">
<?php $this->endBlock()?>

<div class="row">
    <div class="col-md-12">

        <div class="block-flat">
            <div class="header">
                <h4>添加案例</h4>
            </div>
            <div class="content">
                <form class="form-horizontal group-border-dashed" id="caseData">
                    <input type="hidden" name="id" value="<?php echo !empty($case['id']) ? $case['id'] : ''?>">
                    <input name="<?= Yii::$app->request->csrfParam;?>" type="hidden" value="<?= Yii::$app->request->csrfToken ?>">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">客户名称</label>
                        <div class="col-sm-9">
                            <input type="text" name="name" value="<?php echo !empty($case['name']) ? $case['name'] : ''?>" class="form-control">
                        </div>
                    </div>
                    <!--@todo 添加客户分类 预留-->
<!--                    <div class="form-group">-->
<!--                        <label class="col-sm-2 control-label">所属分类</label>-->
<!--                        <div class="col-sm-9">-->
<!--                            <input type="text" value="--><?php //echo !empty($pInfo['pname']) ? $pInfo['pname'] : '根目录';?><!--" class="form-control" readonly="true">-->
<!--                        </div>-->
<!--                    </div>-->
                    <div class="form-group">
                        <label class="col-sm-2 control-label">项目地址</label>
                        <div class="col-sm-9">
                            <input type="text" name="url" value="<?php echo !empty($case['url']) ? $case['url'] : ''?>" class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">完成时间</label>
                        <div class="col-sm-9">
                            <input type="text" name="completed" value="<?php echo !empty($case['completed']) ? $case['completed'] : ''?>" class="form-control">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">项目描述</label>
                        <div class="col-sm-9">
                            <textarea name="desc" class="form-control"><?php echo !empty($case['desc']) ? $case['desc'] : ''?></textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">项目简介</label>
                        <div class="col-sm-9">
                            <textarea name="content" class="layui-textarea" id="editor" style="display: none"><?php echo !empty($case['content']) ?
                                    $case['content'] : '';?></textarea>
                        </div>
                    </div>

                    <div class="form-group" style="padding-bottom: 0px" id="inputHtml">
                        <label class="col-sm-2 control-label">项目截图</label>
                        <div class="col-sm-10">
                            <button type="button" id="upload" class="btn btn-primary"><i class="fa fa-cloud-upload"></i> 选择图片</button>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                            <div class="content">
                                <table style="width: 90%">
                                    <thead>
                                        <tr>
                                            <th class="text-center">文件名</th>
                                            <th class="text-center">大小</th>
                                            <th class="text-center">状态</th>
                                            <th class="text-center">操作</th>
                                        </tr>
                                    </thead>
                                    <tbody id="thumbList"></tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-10 col-sm-2">
                            <button type="button" id="uploadAction" class="btn btn-primary"><i class="fa fa-cloud-upload"></i> 点击上传</button>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                            <button type="button" onclick="saveInfo.saveData()" class="btn btn-primary"><i class="fa fa-save"></i>保存</button>
                            <button onclick="history.go(-1);" class="btn btn-default"><i class="fa fa-mail-reply"></i>返回</button>
                        </div>
                    </div>

                </form>
            </div>
        </div>

    </div>
</div>
<?php $this->beginBlock('footerJsFile')?>
    <script src="/plugins/layui/layui.js"></script>
<?php $this->endBlock()?>

<?php $this->beginBlock('footerJsText')?>

<script type="text/javascript">
    //给Array对象注册一个remove方法 删除数组中指定值
    Array.prototype.remove = function(args) {
        var index = this.indexOf(args);
        if (index > -1) {
            this.splice(index, 1);
        }
    };

    var layedit,layerIndex;
    // 编辑器相关操作
    layui.use('layedit', function(){
        layedit = layui.layedit
            ,$ = layui.jquery;
        // 初始化图片上传
        layedit.set({
            uploadImage: {
                url: '<?php echo \yii\helpers\Url::to(['admin/api/upload/content'])?>' //接口url
                ,type: 'post' //默认post
                ,data:{
                    '<?php echo Yii::$app->request->csrfParam?>':'<?php echo Yii::$app->request->csrfToken?>',
                    category:'image',
                    action:'case'

                }//额外数据
            }
        });

        //构建一个默认的编辑器
        layerIndex = layedit.build('editor');
    });

    //多文件列表示例
    layui.use('upload', function() {
        var $ = layui.jquery
            , upload = layui.upload;
        var thumbList = $('#thumbList')
            , uploadListIns = upload.render({
            elem: '#upload'
            , url: '<?php echo \yii\helpers\Url::to(['admin/api/upload/index'])?>' //上传接口
            , accept: 'image'
            , multiple: true
            , method: 'post'
            ,data:{
                '<?php echo Yii::$app->request->csrfParam?>':'<?php echo Yii::$app->request->csrfToken?>',
                category:'image',
                action:'case'

            }//额外数据
            , auto: false
            , bindAction: '#uploadAction'
            , choose: function (obj) {
                files = obj.pushFile(); //将每次选择的文件追加到文件队列

                //读取本地文件
                obj.preview(function (index, file, result) {
                    var tr = $(['<tr id="upload-' + index + '">'
                        , '<td class="text-center">' + file.name + '</td>'
                        , '<td class="text-center">' + (file.size / 1014).toFixed(1) + 'kb</td>'
                        , '<td class="text-center">等待上传</td>'
                        , '<td class="text-center">'
                        , '<button class="btn btn-primary btn-xs layui-hide demo-reload">重传</button>'
                        , '<button class="btn btn-warning btn-xs demo-delete">删除</button>'
                        , '</td>'
                        , '</tr>'].join(''));

                    //单个重传
                    tr.find('.demo-reload').on('click', function () {
                        obj.upload(index, file);
                    });

                    //删除
                    tr.find('.demo-delete').on('click', function () {
                        delete files[index]; //删除对应的文件
                        tr.remove();
                    });

                    thumbList.append(tr);
                });
            }
            , done: function (res, index, upload) {
                if (res.state === 'SUCCESS') { //上传成功
                    var tr = thumbList.find('tr#upload-' + index)
                        , tds = tr.children();
                    tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
//                    tds.eq(3).html('<button onclick="saveInfo.deletePicture('+res.path+')" class="btn btn-success btn-xs picture-delete">删除</button>'); //此处的删除
                    tds.eq(3).html(''); //此处的删除
                    // 已经上传的文件，只删除数据库的记录 不删除磁盘文件
                    delete files[index]; //删除文件队列已经上传成功的文件

                    var inputHtml = '<input type="hidden" name="picture[]" value="'+res.path+'">';// 存放上传的文件的路径 入库使用
                    $("#inputHtml").append(inputHtml);
                    return;
                }
                this.error(index, upload);
            }
            , error: function (index, upload) {
                var tr = thumbList.find('tr#upload-' + index)
                    , tds = tr.children();
                tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
                tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
            }
        });
    });

    // 数据保存相关操作
    var saveInfo = {
        saveData:function () {
            layedit.sync(layerIndex);
            var data = $("#caseData").serialize();
            ajaxLock = false;
            if (ajaxLock)return false;
            ajaxLock = true;
            $.ajax({
                type:'POST',
                dataType:'json',
                data:data,
                url:'<?php echo \yii\helpers\Url::to(['admin/case/save'])?>',
                success:function (resp) {
                    layer.msg(resp.m);
                },
                error:function () {
                    console.log("save失败");
                }
            });
        }
//        ,
        //删除数组中指定值
//        deletePicture:function ($path) {
//            $(this).remove();
//        }
    };
</script>
<?php $this->endBlock()?>